// 引入Count的UI组件
import CountUI from '../../components/Count'
// 引入connect用于连接UI组件与redux
import { connect } from 'react-redux'
// 引入 action
import {
    createIncrementAction,
    createDecementAction,
    createIncrementAsyncAction
} from '../../redux/count_action'


// mapStateToProps 函数返回的是一个对象
// 返回的对象中的key就作为传递给UI组件props的key，value就作为传递给UI组件的props的value
// mapStateToProps 用于传递状态
function mapStateToProps(state) {
    return {
        count: state
    }
}

// mapDispatchToProps 函数返回的是一个对象
// 返回的对象中的key就作为传递给UI组件props的key，value就作为传递给UI组件的props的value
// mapStateToProps 用于传递操作状态的方法
function mapDispatchToProps(dispatch) {
    return {
        jia:number =>  dispatch(createIncrementAction(number)),
        jian: number => dispatch(createDecementAction(number*1)),
        jiaAsync: (number, timer) => dispatch(createIncrementAsyncAction(number*1, timer))
    }
}


// 使用connect()()创建并暴露一个Count的容器组件
export default connect(mapStateToProps, mapDispatchToProps)(CountUI)

